<template>
<div >
  <h1 style="">美食故事</h1>
  <div >
    <ul>
      <li v-for="v in list">
        <div class="module">
          <div style="display: inline-block" class="img"><img :src="v.src"></div>
          <div style="display: inline-block;" class="text">
            <span style="font-size: xx-large;display: inline-block;margin: 10px">{{ v.name }}</span><br>
            <span style="font-family: '宋体'">{{v.story}}</span>
          </div>
        </div>
      </li>
    </ul>
  </div>
</div>
</template>

<script>
export default {
  name: "shouye2",
  data(){
    return{
      list:[
        {name:"东坡肉",src:"static/images/shouye/meishi3.jpg",story:"苏东坡再次回杭州担任地方官，实则为一任大方父母官，本质上是流放，这个时期的苏东坡不仅没有了往常的门庭若市，而且生活上更加清贫，且心境悲凉，他自己开荒种地，经常自己烧菜做饭与朋友共享。任官的时候，苏东坡曾号召杭州数以百万的百姓疏通西湖堵塞的泥沙，把挖出来的泥沙堆成堤坝，兴建和修缮水利工程、设施，实实在在的为地方百姓做好事，那时候猪肉也便宜，老百姓为了感谢这位为了人民群众的好官，便把当地有名的绍兴酒（黄酒）和好多猪肉送给苏东坡，来感谢这位父母官，然而苏东坡取之于民用之于民，又吩咐家人:把猪肉烧炖好之后，连带黄酒一同送到工地去慰问劳动的民工，却不曾想家人错误的理解，是把猪肉和黄酒放一块炖煮，结果让人意想不到的是，错误的方法竟然弄巧成拙，烧炖出来的猪肉竟然格外的香醇美味，而且色泽红亮，别有一番风味，民工吃到这样的肉之后还连连称赞，还把他送来的肉叫作“东坡肉”，此事竟然传位一段佳话，消息一传十十传百，很是迅速，百姓们也纷纷称赞，能吃上这样的肉，都是苏东坡的功劳，与此同时，百姓们也都开始挨个效仿苏东坡的这种烹饪手法，此后，“东坡肉”也就成为了杭州当地的特色名菜，扬名天下，想吃肉就会想到东坡肉。"},
        {name:"臭豆腐",src:"static/images/shouye/meishi2.jpg",story: "臭豆腐是一种传统小吃，有着几百年的历史。臭豆腐的发明，纯属是一次意外，但就是这样一次美丽的意外，造就了名扬中外的臭豆腐。相传在清朝康熙年间，安徽一名叫做王致和的人赴京赶考，结果名落孙山，路费也花光了，之后靠着制作豆腐这么手艺在京城维持生计。又一次，正值炎炎夏日，他制作的豆腐还有好多没有卖出去，他觉得倒掉好浪费，于是就把豆腐切成小块，然后放入坛子中，加入大量盐和花椒，然后密封保存。后来时间一长，王致和忘记了这件事，等他打开坛子的时候，奇臭无比，豆腐变成了青黑色。他好奇地尝了一下，结果味道鲜美无比。就这样，臭豆腐诞生了。"},
        {name: "麻婆豆腐",src:"static/images/shouye/meishi6.jpg",story:"麻婆豆腐始创于清朝同治元年（1862年），在成都万福桥边，有一家原名“陈兴盛饭铺”的店面。店主陈春富（陈森富）早殁，小饭店便由老板娘经营，女老板面上微麻，人称\"陈麻婆\"。\n" +
            "当年的万福桥是一道横跨府河，常有苦力之人在此歇脚、打尖。光顾饭铺的主要是挑油的脚夫。\n" +
            "陈氏对烹制豆腐有一套独特的烹饪技巧，烹制出的豆腐色香味俱全，不同凡响，深得人们喜爱，她创制的烧豆腐，则被称为“陈麻婆豆腐”，其饮食小店后来也以“陈麻婆豆腐店”为名。"}

      ]
    }
  }
}
</script>

<style scoped>
.module{
  display: block;
  width: 90%;
  height: 300px;
  /*right: 10%;*/
  border: solid 2px black;
  margin: 20px;
}
li {
  list-style-type: none;
}
.img{
  display: inline-block;
  width: 30%;
  height: 90%;
  margin:17px;
  /*border: solid 2px red;*/
}
img{
  width: 100%;
  height: 100%;
}
.text{
  width: 50%;
  position: absolute;
}
</style>
